import 'package:flutter/material.dart';

class MyApp17 extends StatelessWidget {
  const MyApp17({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GridView初体验'),
        centerTitle: true,
        backgroundColor: const Color.fromARGB(255, 111, 197, 231),
      ),
      body: GridView(
        // 视图代理
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          // 设置侧轴的个数
          crossAxisCount: 4,
          // 设置主轴间距
          mainAxisSpacing: 10,
          // 设置侧轴间距
          crossAxisSpacing: 10,
          // 设置宽高比
          childAspectRatio: 4 / 3,
        ),
        children: [
          Container(
            color: Colors.green,
            alignment: Alignment.center,
            child: const Text('黑马程序员1'),
          ),
          Container(
            color: Colors.pink,
            alignment: Alignment.center,
            child: const Text('黑马程序员2'),
          ),
          Container(
            color: Colors.blue,
            alignment: Alignment.center,
            child: const Text('黑马程序员3'),
          ),
          Container(
            color: Colors.yellow,
            alignment: Alignment.center,
            child: const Text('黑马程序员4'),
          ),
          Container(
            color: Colors.cyan,
            alignment: Alignment.center,
            child: const Text('黑马程序员5'),
          ),
          Container(
            color: Colors.green,
            alignment: Alignment.center,
            child: const Text('黑马程序员6'),
          ),
        ],
      ),
    );
  }
}
